<%--
  Created by IntelliJ IDEA.
  User: 张雄
  Date: 2019/9/19
  Time: 10:46
  To change this template use File | Settings | File Templates.
--%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
	<title>考题页面</title>
	<jsp:include page="../layout/_imports.jsp"></jsp:include>
</head>

<script>
    window.onload = function () {
        // button
        var prevBtn = document.getElementById("prev");
        var nextBtn = document.getElementById("next");
        var submit = document.getElementById("sbm");
        var ok = document.getElementById("ok");
        //form
        var form = document.getElementById("form");
        //info
        var nextId = document.getElementById("nextId");
        var confirm = document.getElementById("confirm");
        prevBtn.onclick = function () {
            nextId.value = Number(itemId.value) - 1;
            form.submit();
        };
        nextBtn.onclick = function () {
            nextId.value = Number(itemId.value) + 1;
            form.submit();
        };
        submit.onclick = function () {
            nextId.value = Number(itemId.value) + 1;
            confirm.value = "true";
            form.submit();
        };
        ok.onclick = function () {
            nextId.value = Number(itemId.value) + 1;
            confirm.value = "";
            form.submit();
        };
    }
</script>
<style>
	h1 {
		text-align: center;
	}

	span {
		display: inline-block;
		height: 30px;
		width: 30px;
		cursor: pointer;
		background-color: gray;
	}

	.aleadyDo {
		background-color: lawngreen;
	}
</style>
<body>
<c:if test="${empty user}">
	<jsp:forward page="../user/login.jsp"></jsp:forward>
</c:if>
<jsp:include page="../layout/_nav.jsp"></jsp:include>
<form action="${pageContext.request.contextPath}/item" id="form">
	<input type="hidden" name="state" value="getItemPage">
	<input type="hidden" name="itemId" value=${item.id} id="itemId">
	<input type="hidden" name="nextId" value=${item.id} id="nextId">
	<input type="hidden" name="confirm" value="false" id="confirm">
	<h1>${item.getTitle(item.id)}</h1>
	<c:forEach begin="0" end="${item.getChooseItemCount() - 1}" var="i">
		<input
				type="<c:choose><c:when test="${item.multiple}">checkbox</c:when><c:otherwise>radio</c:otherwise></c:choose>"
				name="choose"
				value="${item.getValue(i)}"
				<c:if test="${item.isChecked(i)}">checked</c:if>
		>
		<c:out value="${item.getChooseItemDescribe(i)}"></c:out>
	</c:forEach>
	<br>
	<input type="button" value="上一题"
	       <c:if test="${item.id + 1 == 1}">hidden</c:if> id="prev">
	<input type="button" value="下一题"
	       <c:if test="${item.id + 1 == itemCount}">hidden</c:if> id="next">
	<input type="button" value="交卷"
	       <c:if test="${item.id + 1 != itemCount}">hidden</c:if> id="sbm">
	<br>
	题号:
	<c:forEach var="i" items="${user.getAllItem()}">
        <span
		        class="<c:if test="${i.chooseId != -1}">aleadyDo</c:if>"
		        onclick="document.getElementById('nextId').value = ${i.id};document.getElementById('form').submit();"
        >
                <c:out value="${i.id + 1}"></c:out>
        </span>
	</c:forEach>
</form>
<c:if test="${attention != null}">
	<c:out value="${attention}"></c:out>
	<input type="button" value="确认" id="ok">
</c:if>

</body>
</html>
